<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <title>交叉引用的演示 :: Antora Docs</title>
    <meta name="generator" content="Antora 3.2.0-alpha.8">
    <link rel="stylesheet" href="../../_/css/site.css">
  </head>
  <body class="article">
<header class="header">
  <nav class="navbar">
    <div class="navbar-brand">
      <a class="navbar-item" href="../..">Antora Docs</a>
      <button class="navbar-burger" aria-controls="topbar-nav" aria-expanded="false" aria-label="Toggle main menu">
        <span></span>
        <span></span>
        <span></span>
      </button>
    </div>
    <div id="topbar-nav" class="navbar-menu">
      <div class="navbar-end">
        <a class="navbar-item" href="#">Home</a>
        <div class="navbar-item has-dropdown is-hoverable">
          <a class="navbar-link" href="#">Products</a>
          <div class="navbar-dropdown">
            <a class="navbar-item" href="#">Product A</a>
            <a class="navbar-item" href="#">Product B</a>
            <a class="navbar-item" href="#">Product C</a>
          </div>
        </div>
        <div class="navbar-item has-dropdown is-hoverable">
          <a class="navbar-link" href="#">Services</a>
          <div class="navbar-dropdown">
            <a class="navbar-item" href="#">Service A</a>
            <a class="navbar-item" href="#">Service B</a>
            <a class="navbar-item" href="#">Service C</a>
          </div>
        </div>
        <div class="navbar-item">
          <span class="control">
            <a class="button is-primary" href="#">Download</a>
          </span>
        </div>
      </div>
    </div>
  </nav>
</header>
<div class="body">
<div class="nav-container" data-component="component-b" data-version="2.5">
  <aside class="nav">
    <div class="panels">
<div class="nav-panel-menu is-active" data-panel="menu">
  <nav class="nav-menu">
    <button class="nav-menu-toggle" aria-label="Toggle expand/collapse all" style="display: none"></button>
    <h3 class="title"><a href="index.html">Component B</a></h3>
<ul class="nav-list">
  <li class="nav-item" data-depth="0">
<ul class="nav-list">
  <li class="nav-item" data-depth="1">
    <button class="nav-item-toggle"></button>
    <a class="nav-link" href="index.html">欢迎</a>
<ul class="nav-list">
  <li class="nav-item is-current-page" data-depth="2">
    <a class="nav-link" href="xrefs-demo.html">交叉引用的演示</a>
  </li>
</ul>
  </li>
</ul>
  </li>
  <li class="nav-item" data-depth="0">
<ul class="nav-list">
  <li class="nav-item" data-depth="1">
    <a class="nav-link" href="module-one/overview.html">模块1概述</a>
  </li>
</ul>
  </li>
</ul>
  </nav>
</div>
<div class="nav-panel-explore" data-panel="explore">
  <div class="context">
    <span class="title">Component B</span>
    <span class="version">2.5-beta.1</span>
  </div>
  <ul class="components">
    <li class="component">
      <div class="title"><a href="../../component-a/1.6.0/source-code.html">Component A</a></div>
      <ul class="versions">
        <li class="version is-latest">
          <a href="../../component-a/1.6.0/source-code.html">1.6.0</a>
        </li>
      </ul>
    </li>
    <li class="component is-current">
      <div class="title"><a href="../3.1/index.html">Component B</a></div>
      <ul class="versions">
        <li class="version is-latest">
          <a href="../3.1/index.html">3.1</a>
        </li>
        <li class="version is-current">
          <a href="index.html">2.5-beta.1</a>
        </li>
        <li class="version">
          <a href="../2.0/index.html">2.0</a>
        </li>
        <li class="version">
          <a href="../1.0/index.html">1.0</a>
        </li>
      </ul>
    </li>
  </ul>
</div>
    </div>
  </aside>
</div>
<main class="article">
<div class="toolbar" role="navigation">
<button class="nav-toggle"></button>
  <a href="../3.1/index.html" class="home-link"></a>
<nav class="breadcrumbs" aria-label="breadcrumbs">
  <ul>
    <li><a href="index.html">Component B</a></li>
    <li><a href="index.html">欢迎</a></li>
    <li><a href="xrefs-demo.html">交叉引用的演示</a></li>
  </ul>
</nav>
<div class="page-versions">
  <button class="version-menu-toggle" title="Show other versions of page">2.5-beta.1</button>
  <div class="version-menu">
    <a class="version" href="../3.1/xrefs-demo.html">3.1</a>
    <a class="version is-current" href="xrefs-demo.html">2.5-beta.1</a>
    <a class="version is-missing" href="../2.0/index.html">2.0</a>
    <a class="version is-missing" href="../1.0/index.html">1.0</a>
  </div>
</div>
</div>
  <div class="content">
<aside class="toc sidebar" data-title="Contents" data-levels="2">
  <div class="toc-menu"></div>
</aside>
<article class="doc">
<h1 class="page">交叉引用的演示</h1>
<div class="sect1">
<h2 id="_方法一直接将xref宏写在正文中"><a class="anchor" href="#_方法一直接将xref宏写在正文中"></a>方法一：直接将<code>xref</code>宏写在正文中</h2>
<div class="sectionbody">
<div class="paragraph">
<p>总结：</p>
</div>
<div class="ulist">
<ul>
<li>
<p>HTML和PDF均能正常跳转。</p>
</li>
<li>
<p>显示效果取决于不同情形。</p>
</li>
</ul>
</div>
<div class="sect2">
<h3 id="bm-ref-other-page"><a class="anchor" href="#bm-ref-other-page"></a>链接其他模块的页面</h3>
<div class="paragraph">
<p>总结：</p>
</div>
<div class="ulist">
<ul>
<li>
<p>PDF中链接显示为章节编号：xref方括号为空。</p>
</li>
<li>
<p>PDF中链接显示为引用文字：xref方括号内应显式定义与页面标题不同的引用文本。</p>
</li>
<li>
<p>HTML不存在章节编号，能正确显示小标题或引用文本。</p>
</li>
</ul>
</div>
<div class="sect3">
<h4 id="_xref使用空的方括号即没有重定义引用文本"><a class="anchor" href="#_xref使用空的方括号即没有重定义引用文本"></a>xref使用空的方括号，即没有重定义引用文本</h4>
<div class="paragraph">
<p>代码：<code>xref:module-one:overview.adoc[]</code></p>
</div>
<div class="paragraph">
<p>链接效果：<a href="module-one/overview.html" class="xref page">模块1概述</a></p>
</div>
<div class="paragraph">
<p>HTML效果：<code>模块1概述</code>，显示为页面标题。可正常跳转。</p>
</div>
<div class="paragraph">
<p>PDF效果：<code>§2</code>，显示为<code>chapter-refsig</code>符号及章编号。可正常跳转。</p>
</div>
</div>
<div class="sect3">
<h4 id="_xref显式文本与被引用页面标题相同"><a class="anchor" href="#_xref显式文本与被引用页面标题相同"></a>xref显式文本与被引用页面标题相同</h4>
<div class="paragraph">
<p>代码：<code>xref:module-one:overview.adoc[模块1概述]</code></p>
</div>
<div class="paragraph">
<p>链接效果：<a href="module-one/overview.html" class="xref page">模块1概述</a></p>
</div>
<div class="paragraph">
<p>HTML效果：<code>模块1概述</code>，显示为页面标题。可正常跳转。</p>
</div>
<div class="paragraph">
<p>PDF效果：<code>§2</code>，显示为<code>chapter-refsig</code>符号及章编号。可正常跳转。</p>
</div>
</div>
<div class="sect3">
<h4 id="_xref显式文本与被引用页面标题不同"><a class="anchor" href="#_xref显式文本与被引用页面标题不同"></a>xref显式文本与被引用页面标题不同</h4>
<div class="paragraph">
<p>代码：<code>xref:module-one:overview.adoc[模块一概述]</code></p>
</div>
<div class="paragraph">
<p>链接效果：<a href="module-one/overview.html" class="xref page">模块一概述</a></p>
</div>
<div class="paragraph">
<p>HTML效果：<code>模块一概述</code>，显示为显式定义的文本。可正常跳转。</p>
</div>
<div class="paragraph">
<p>PDF效果：<code>模块一概述</code>，显示为显式定义的文本。可正常跳转。</p>
</div>
</div>
</div>
<div class="sect2">
<h3 id="_链接到其他模块页面内的锚点如小标题"><a class="anchor" href="#_链接到其他模块页面内的锚点如小标题"></a>链接到其他模块页面内的锚点（如小标题）</h3>
<div class="paragraph">
<p>总结：</p>
</div>
<div class="ulist">
<ul>
<li>
<p>只要xref方括号内定义了引用文本，HTML和PDF均显示该文本，无论与被引用小标题是否相同。</p>
</li>
<li>
<p>如果xref方括号内是空的，PDF显示章节编号，HTML显示「文件名#锚点名」。</p>
</li>
</ul>
</div>
<div class="paragraph">
<p>说明：</p>
</div>
<div class="ulist">
<ul>
<li>
<p>如果锚点不在小标题上，锚点处应显式定义引用文本，情形与小标题相当。</p>
</li>
</ul>
</div>
<div class="paragraph">
<p>结论：</p>
</div>
<div class="paragraph">
<p>xref方括号内应定义引用文本，即使与小标题相同，否则HTML显示不正常。</p>
</div>
<div class="sect3">
<h4 id="_xref使用空的方括号即没有重定义引用文本_2"><a class="anchor" href="#_xref使用空的方括号即没有重定义引用文本_2"></a>xref使用空的方括号，即没有重定义引用文本</h4>
<div class="paragraph">
<p>代码：<code>xref:module-one:overview.adoc#bm-b-m1-page-source[]</code></p>
</div>
<div class="paragraph">
<p>链接效果：<a href="module-one/overview.html#bm-b-m1-page-source" class="xref page">module-one:overview.adoc#bm-b-m1-page-source</a></p>
</div>
<div class="paragraph">
<p>HTML效果：<code>module-one:overview.adoc#bm-b-m1-page-source</code>。可正常跳转。</p>
</div>
<div class="paragraph">
<p>PDF效果：<code>§2.1</code>。可正常跳转。</p>
</div>
</div>
<div class="sect3">
<h4 id="_xref显式文本与被引用小标题相同"><a class="anchor" href="#_xref显式文本与被引用小标题相同"></a>xref显式文本与被引用小标题相同</h4>
<div class="paragraph">
<p>代码：<code>xref:module-one:overview.adoc#bm-b-m1-page-source[页面来源]</code></p>
</div>
<div class="paragraph">
<p>链接效果：<a href="module-one/overview.html#bm-b-m1-page-source" class="xref page">页面来源</a></p>
</div>
<div class="paragraph">
<p>HTML效果：<code>页面来源</code>。可正常跳转。</p>
</div>
<div class="paragraph">
<p>PDF效果：<code>页面来源</code>。可正常跳转。</p>
</div>
</div>
<div class="sect3">
<h4 id="_xref显式文本与被引用小标题不同"><a class="anchor" href="#_xref显式文本与被引用小标题不同"></a>xref显式文本与被引用小标题不同</h4>
<div class="paragraph">
<p>代码：<code>xref:module-one:overview.adoc#bm-b-m1-page-source[模块1的页面来源]</code></p>
</div>
<div class="paragraph">
<p>链接效果：<a href="module-one/overview.html#bm-b-m1-page-source" class="xref page">模块1的页面来源</a></p>
</div>
<div class="paragraph">
<p>HTML效果：<code>模块1的页面来源</code>。可正常跳转。</p>
</div>
<div class="paragraph">
<p>PDF效果：<code>模块1的页面来源</code>。可正常跳转。</p>
</div>
</div>
<div class="sect3">
<h4 id="_xref使用空的方括号但锚点处显式定义了引用文本"><a class="anchor" href="#_xref使用空的方括号但锚点处显式定义了引用文本"></a>xref使用空的方括号，但锚点处显式定义了引用文本</h4>
<div class="paragraph">
<p>代码：<code><a href="module-one/overview.html#bm-after-title" class="xref page">module-one:overview.adoc#bm-after-title</a></code></p>
</div>
<div class="paragraph">
<p>链接：<a href="module-one/overview.html#bm-after-title" class="xref page">module-one:overview.adoc#bm-after-title</a></p>
</div>
<div class="paragraph">
<p>HTML效果：<code>module-one:overview.adoc#bm-after-title</code>。可正常跳转。</p>
</div>
<div class="paragraph">
<p>PDF效果：<code>锚点处显式定义的引用文本</code>。可正常跳转。</p>
</div>
</div>
</div>
<div class="sect2">
<h3 id="_链接本模块的其他页面"><a class="anchor" href="#_链接本模块的其他页面"></a>链接本模块的其他页面</h3>
<div class="paragraph">
<p>总结：</p>
</div>
<div class="paragraph">
<p>与<a href="#bm-ref-other-page">链接其他模块的页面</a>的情形相同。</p>
</div>
<div class="sect3">
<h4 id="_xref使用空的方括号即没有重定义引用文本_3"><a class="anchor" href="#_xref使用空的方括号即没有重定义引用文本_3"></a>xref使用空的方括号，即没有重定义引用文本</h4>
<div class="paragraph">
<p>代码：<code>xref:index.adoc[]</code></p>
</div>
<div class="paragraph">
<p>效果：<a href="index.html" class="xref page">欢迎来到 Component B!</a></p>
</div>
</div>
<div class="sect3">
<h4 id="_xref显式文本与被引用页面标题相同_2"><a class="anchor" href="#_xref显式文本与被引用页面标题相同_2"></a>xref显式文本与被引用页面标题相同</h4>
<div class="paragraph">
<p>代码：<code>xref:index.adoc[欢迎来到 Component B!]</code></p>
</div>
<div class="paragraph">
<p>效果：<a href="index.html" class="xref page">欢迎来到 Component B!</a></p>
</div>
</div>
<div class="sect3">
<h4 id="_xref显式文本与被引用页面标题不同_2"><a class="anchor" href="#_xref显式文本与被引用页面标题不同_2"></a>xref显式文本与被引用页面标题不同</h4>
<div class="paragraph">
<p>代码：<code>xref:index.adoc[欢迎页]</code></p>
</div>
<div class="paragraph">
<p>效果：<a href="index.html" class="xref page">欢迎页</a></p>
</div>
</div>
<div class="sect3">
<h4 id="_xref使用空的方括号且带锚点"><a class="anchor" href="#_xref使用空的方括号且带锚点"></a>xref使用空的方括号，且带锚点</h4>
<div class="paragraph">
<p>代码：<code>xref:index.adoc#sect1-2[]</code></p>
</div>
<div class="paragraph">
<p>效果：<a href="index.html#sect1-2" class="xref page">index.adoc#sect1-2</a></p>
</div>
</div>
</div>
</div>
</div>
<div class="sect1">
<h2 id="_方法二xref宏写在自定义属性中正文中链接处写属性名"><a class="anchor" href="#_方法二xref宏写在自定义属性中正文中链接处写属性名"></a>方法二：<code>xref</code>宏写在自定义属性中，正文中链接处写<code>{属性名}</code></h2>
<div class="sectionbody">
<div class="paragraph">
<p>总结：</p>
</div>
<div class="ulist">
<ul>
<li>
<p>PDF中不能跳转。显示pdf文件名。</p>
</li>
<li>
<p>HTML中均能正常跳转。显示情形与方法一相同。</p>
</li>
</ul>
</div>
<div class="sect2">
<h3 id="_以下是各种情形"><a class="anchor" href="#_以下是各种情形"></a>以下是各种情形：</h3>
<div class="sect3">
<h4 id="_属性定义完整的xref宏"><a class="anchor" href="#_属性定义完整的xref宏"></a>属性定义完整的xref宏</h4>
<div class="paragraph">
<p>代码：</p>
</div>
<div class="literalblock">
<div class="content">
<pre>:overview-with-xref: xref:module-one:overview.adoc[]

{overview-with-xref}</pre>
</div>
</div>
<div class="paragraph">
<p>链接效果：<a href="module-one/overview.html" class="xref page">模块1概述</a></p>
</div>
</div>
<div class="sect3">
<h4 id="_属性定义完整的xref宏且带锚点"><a class="anchor" href="#_属性定义完整的xref宏且带锚点"></a>属性定义完整的xref宏且带锚点</h4>
<div class="paragraph">
<p>代码：</p>
</div>
<div class="literalblock">
<div class="content">
<pre>:overview-with-anchor: xref:module-one:overview.adoc#module-one-overview[]

{overview-with-anchor}</pre>
</div>
</div>
<div class="paragraph">
<p>链接效果：<a href="module-one/overview.html#module-one-overview" class="xref page">module-one:overview.adoc#module-one-overview</a></p>
</div>
</div>
<div class="sect3">
<h4 id="_属性定义未包含方括号"><a class="anchor" href="#_属性定义未包含方括号"></a>属性定义未包含方括号</h4>
<div class="paragraph">
<p>代码：</p>
</div>
<div class="literalblock">
<div class="content">
<pre>:overview-with-xref-without-brackets: xref:module-one:overview.adoc

{overview-with-xref-without-brackets}[]</pre>
</div>
</div>
<div class="paragraph">
<p>链接效果：<a href="module-one/overview.html" class="xref page">模块1概述</a></p>
</div>
</div>
<div class="sect3">
<h4 id="_属性定义未包含xref"><a class="anchor" href="#_属性定义未包含xref"></a>属性定义未包含<code>xref:</code></h4>
<div class="paragraph">
<p>代码：</p>
</div>
<div class="literalblock">
<div class="content">
<pre>:overview-without-xref: module-one:overview.adoc[]

xref:{overview-without-xref}</pre>
</div>
</div>
<div class="paragraph">
<p>链接效果：<a href="module-one/overview.html" class="xref page">模块1概述</a></p>
</div>
</div>
<div class="sect3">
<h4 id="_属性定义未包含xref和方括号"><a class="anchor" href="#_属性定义未包含xref和方括号"></a>属性定义未包含<code>xref:</code>和方括号</h4>
<div class="paragraph">
<p>代码：</p>
</div>
<div class="literalblock">
<div class="content">
<pre>:overview-without-xref-brackets: module-one:overview.adoc

xref:{overview-without-xref-brackets}[]</pre>
</div>
</div>
<div class="paragraph">
<p>链接效果：<a href="module-one/overview.html" class="xref page">模块1概述</a></p>
</div>
</div>
</div>
</div>
</div>
</article>
  </div>
</main>
</div>
<footer class="footer">
  <p>This page was built using the Antora default UI.</p>
  <p>The source code for this UI is licensed under the terms of the MPL-2.0 license.</p>
</footer>
<script id="site-script" src="../../_/js/site.js" data-ui-root-path="../../_"></script>
<script async src="../../_/js/vendor/highlight.js"></script>
  </body>
</html>
